<template>
  <card-page v-loading="loading">
    <el-row>
      <el-col :span="2">店铺图片</el-col>
      <el-col :span="15">
        <el-image
          :src="shopInfo.imgUrl"
          :preview-src-list="[shopInfo.imgUrl]"
          fit="cover"
          style="width: 60px; height: 60px; border-radius: 4px;"
        />
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="2">店铺名称</el-col>
      <el-col :span="15">{{shopInfo.name}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">店铺描述</el-col>
      <el-col :span="15">{{shopInfo.description}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">所属行业</el-col>
      <el-col :span="15">{{DictMan.itemMap('product.industry')[shopInfo.industryId]}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">店铺类型</el-col>
      <el-col :span="15">{{DictMan.itemMap('provider.type')[shopInfo.providerType]}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">店铺地址</el-col>
      <el-col :span="15">{{shopInfo.fullAddress}}</el-col>
    </el-row>
    <el-row v-if="shopInfo.orgId == -1">
      <el-col :span="2">服务社区</el-col>
      <el-col :span="15">
        <span v-if="shopInfo.orgId == -1">无限制</span>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="2">服务范围</el-col>
      <el-col :span="15">{{shopInfo.serviceArea == null ? '' : (shopInfo.serviceArea == 0 ? '无限制' : shopInfo.serviceArea + '米')}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">营业时间</el-col>
      <el-col :span="15"><el-tag type="warning">{{shopInfo.serviceTime}}</el-tag></el-col>
    </el-row>
    <el-row>
      <el-col :span="2">派单模式</el-col>
      <el-col :span="15"><el-tag :type="shopInfo.businessMode ? 'primary' : 'info'">{{shopInfo.businessMode ? '是' : '否'}}</el-tag></el-col>
    </el-row>
    <el-row>
      <el-col :span="2">联系人</el-col>
      <el-col :span="15">{{shopInfo.linkman}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">联系电话</el-col>
      <el-col :span="15">{{shopInfo.telephone}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">商家工号</el-col>
      <el-col :span="15">{{shopInfo.adminUsername}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="2">创建时间</el-col>
      <el-col :span="15">{{shopInfo.createTime}}</el-col>
    </el-row>
  </card-page>
</template>


<script>
export default {
  pageProps: {
    title({params, subTitle}) {
      return subTitle(params.shop.name, '店铺详情');
    }
  },
  data() {
    return {
      loading: false,
      shopInfo: {}
    };
  },
  async mounted() {
    this.loading = true;
    this.shopInfo = await this.$http.get('/api/shop/pro/info', {params: {id: this.$params.shop.id}});
    this.loading = false;
  }
}
</script>


<style scoped>
.card-page {
  width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.el-row {
  font-size: 14px;
  line-height: 40px;
}
.el-col-5 {
  padding-right: 16px;
  text-align: right;
  font-weight: 500;
} 
</style>
